// 科技风格输入框样式
:deep(.el-input__wrapper) {
  background: linear-gradient(
    180deg, 
    rgba(0, 108, 183, 0.1) 0%, 
    rgba(0, 108, 183, 0.15) 50%, 
    rgba(0, 108, 183, 0.1) 100%
  ) !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(31, 106, 178, 0.4) !important;
  box-shadow: 
    inset 0 0 15px rgba(0, 209, 237, 0.05),
    0 0 10px rgba(0, 0, 0, 0.2),
    0 0 5px rgba(0, 209, 237, 0.1) !important;
  border-radius: 4px !important;
  transition: all 0.3s ease !important;
  position: relative !important;
  overflow: hidden !important;
  
  &:hover {
    border-color: rgba(0, 209, 237, 0.5) !important;
    box-shadow: 
      inset 0 0 15px rgba(0, 209, 237, 0.08),
      0 0 15px rgba(0, 0, 0, 0.25),
      0 0 8px rgba(0, 209, 237, 0.15) !important;
  }
  
  &:focus-within {
    border-color: rgba(0, 209, 237, 0.6) !important;
    box-shadow: 
      inset 0 0 20px rgba(0, 209, 237, 0.1),
      0 0 15px rgba(0, 0, 0, 0.3),
      0 0 10px rgba(0, 209, 237, 0.2) !important;
    
    &::before {
      opacity: 1;
    }
  }
  
  &::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(
      90deg,
      transparent,
      rgba(0, 209, 237, 0.5) 20%,
      rgba(0, 209, 237, 0.5) 80%,
      transparent
    );
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
  }
  
  &::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
      linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 20px 20px;
    pointer-events: none;
    opacity: 0.3;
    z-index: 0;
  }
}

:deep(.el-input__inner) {
  background-color: transparent !important;
  color: rgba(255, 255, 255, 0.9) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.9) !important;
  caret-color: rgba(0, 209, 237, 0.9) !important;
  box-shadow: none !important;
  font-family: 'PingFang SC', sans-serif !important;
  letter-spacing: 0.5px !important;
  position: relative !important;
  z-index: 2 !important;
  text-shadow: 0 0 5px rgba(0, 209, 237, 0.2) !important;
  transition: all 0.3s ease !important;
  
  &:focus {
    text-shadow: 0 0 8px rgba(0, 209, 237, 0.3) !important;
  }
}

:deep(input::-webkit-input-placeholder) {
  -webkit-text-fill-color: rgba(95, 117, 127, 0.6) !important;
  opacity: 0.7 !important;
  font-style: italic !important;
  letter-spacing: 0.5px !important;
  text-shadow: none !important;
}



// 数字输入框样式
:deep(.el-input-number) {
  .el-input-number__decrease, 
  .el-input-number__increase {
    background-color: rgba(0, 108, 183, 0.2) !important;
    border-color: rgba(31, 106, 178, 0.4) !important;
    color: rgba(0, 209, 237, 0.8) !important;
    transition: all 0.2s ease !important;
    
    &:hover {
      background-color: rgba(0, 108, 183, 0.3) !important;
      color: rgba(0, 209, 237, 1) !important;
    }
  }
}

// 日期选择器样式
:deep(.el-date-editor) {
  .el-range-input {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.9) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.9) !important;
  }
  
  .el-range-separator {
    color: rgba(0, 209, 237, 0.7) !important;
  }
  
  .el-range__icon, .el-range__close-icon {
    color: rgba(0, 209, 237, 0.7) !important;
  }
}

// 文本域样式
:deep(.el-textarea__inner) {
  background-color: #001e3f!important;
  color: rgba(255, 255, 255, 0.9) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.9) !important;
  caret-color: rgba(0, 209, 237, 0.9) !important;
  box-shadow: none !important;
  font-family: 'PingFang SC', sans-serif !important;
  letter-spacing: 0.5px !important;
  position: relative !important;
  z-index: 2 !important;
  text-shadow: 0 0 5px rgba(0, 209, 237, 0.2) !important;
  transition: all 0.3s ease !important;
 
  &:focus {
    text-shadow: 0 0 8px rgba(0, 209, 237, 0.3) !important;
  }
}


// 禁用状态样式
:deep(.is-disabled) {
  .el-input__wrapper {
    background: rgba(6, 36, 74, 0.5) !important;
    opacity: 0.7 !important;
    border-color: rgba(31, 106, 178, 0.2) !important;
    box-shadow: none !important;
  }
  
  .el-input__inner {
    color: rgba(255, 255, 255, 0.5) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.5) !important;
    text-shadow: none !important;
  }
}


